<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--SEO优化项 -->
    <title>04</title>
    <meta name="description" content="这里输入网站简介" />
    <meta name="Keywords" content="这里输入网站关键词" />
    <!-- 引入facicon.ico网页图标 -->
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <!-- 引入css 初始化的css 文件 -->
    <link rel="stylesheet" href="css/base.css">
    <!-- 引入公共样式的css 文件 -->
    <link rel="stylesheet" href="css/common.css">
    <!-- 引入本页面css 文件 -->
    <link rel="stylesheet" href="css/04.css">
</head>

<body>
    <div class="w1920 bg">

        <!-- 顶部快捷导航 -->
        <div class="nav">
            <!-- logo -->
            <div class="logo fl">
                <img src="img/duocaiyoueryuan_logo.png" width="80px" height="81px" alt="logo">
            </div>
            <!-- 导航按钮 -->
            <div class="nav-box fl">
                <!-- 首页——导航图标模块 -->
                <!-- <div class="nav-bar">
                    <ul class="nav-box-color">
                        <li class="nav-box-color-icon">
                            <img src="img/index@2x.png" width="23px" height="23px" alt="indexIcon">
                        </li>
                        <a href="javascript:;" class="nav-box-color-text">首页</a>
                    </ul>
                </div> -->

                <!-- 班级动态——导航图标模块 -->
                <!-- <div class="nav-bar-four" style="margin-left: 48px;">
                    <ul class="nav-box-color-four">
                        <li class="nav-box-color-icon">
                            <img src="img/班级 拷贝 2@2x.png" width="23px" height="23px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-four">班级动态</a>
                </div> -->

                <!-- 宝宝课表——导航图标模块 -->
                <!-- <div class="nav-bar-four" style="margin-left: 47px;">
                    <ul class="nav-box-color-four">
                        <li class="nav-box-icon" style="top: 13px;left: 13px;">
                            <img src="img/课表@2x 拷贝 2@2x.png" width="22px" height="22px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-four">宝宝课表</a>
                </div> -->

                <!-- 宝宝请假——导航图标模块 -->
                <!-- <div class="nav-bar-four" style="margin-left: 48px;">
                    <ul class="nav-box-color-four">
                        <li class="nav-box-icon" style="top: 12px;left: 11px;">
                            <img src="img/学生请假 拷贝 2@2x.png" width="25px" height="23px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-four">宝宝请假</a>
                </div> -->

                <!-- 幼儿园介绍——导航图标模块 -->
                <!-- <div class="nav-bar-five" style="margin-left: 48px;">
                    <ul class="nav-box-color-five">
                        <li class="nav-box-icon" style="top: 13px;left: 11px;">
                            <img src="img/幼儿园 拷贝 2@2x.png" width="22px" height="25px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-five">幼儿园介绍</a>
                </div> -->

                <!-- 出勤详情——导航图标模块 -->
                <!-- <div class="nav-bar-four" style="margin-left: 48px;">
                    <ul class="nav-box-color-four">
                        <li class="nav-box-icon" style="top: 12px;left: 13px;">
                            <img src="img/出勤 拷贝 2@2x.png" width="22px" height="23px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-four">出勤详情</a>
                </div> -->

                <!-- 发展评价——导航图标模块 -->
                <!-- <div class="nav-bar-four" style="margin-left: 48px;">
                    <ul class="nav-box-color-four">
                        <li class="nav-box-color-icon">
                            <img src="img/评价 (1) 拷贝 2@2x.png" width="23px" height="23px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-four">发展评价</a>
                </div> -->

                <!-- 宝宝相册——导航图标模块 -->
                <!-- <div class="nav-bar-four" style="margin-left: 48px;">
                    <ul class="nav-box-color-four">
                        <li class="nav-box-icon" style="top: 13px;left: 11px;">
                            <img src="img/相册 拷贝 2@2x.png" width="25px" height="25px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-four">宝宝相册</a>
                </div> -->

                <!-- 班牌设置——导航图标模块 -->
                <!-- <div class="nav-bar-four" style="margin-left: 48px;">
                    <ul class="nav-box-color-four">
                        <li class="nav-box-icon" style="top: 13px;left: 13px;">
                            <img src="img/设置 拷贝 2@2x.png" width="22px" height="22px" alt="indexIcon">
                        </li>
                    </ul>
                    <a href="javascript:;" class="nav-box-color-text-four">班牌设置</a>
                </div> -->

            </div>
            <!-- 日期天气时间 -->
            <div class="weatherDate-Box fr">
                <ul class="temperature fr">21-32°C</ul>
                <ul class="weather fr">
                    <img src="img/天气@2x.png" width="54px" height="53px" alt="weather">
                </ul>
                <ul class="time fr">14 : 43</ul>
                <ul class="dateBox fl">
                    <li class="date">2020-11-16</li>
                    <li class="week">星期一</li>
                </ul>
            </div>
            <!-- 顶部快捷导航start -->
        </div>
        <div class="centerBox fl">
            <div class="yezi fr">
                <img src="img/千库网_叶子和小朋友_元素编号12807114@2x.png" width="270px" height="369px" alt="yezi">
            </div>

            <div class="zhaopian fl">
                <img src="img/图层 775.png" width="494px" height="599px" alt="xiaopengyou">
            </div>

            <!-- <div class="xiaopengyou">
                <img src="img/图层 775.png" width="494px" height="599px" alt="xiaopengyou">
            </div> -->


            <div class="infoBox fl">
                <ul class="infoBox-shuaka">刷卡信息</ul>
                <ul class="nameBox fl">
                    <li class="name">姓名：李丽丽</li>
                </ul>
                <ul class="nameBox fl">
                    <li class="name">年纪：2岁半</li>
                </ul>
                <ul class="nameBox fl">
                    <li class="name">班级：大三班</li>
                </ul>
                <ul class="nameBox fl">
                    <li class="name">职位：小组长</li>
                </ul>
            </div>


        </div>
    </div>




</body>

</html>